<template>
  <div class="Achievement">
    <div class="header">
      <ImportFile :on-success="success"></ImportFile>
      <el-button style="margin-left: 12px" @click="exportData" size="small" >导出</el-button>
      <el-button @click="groupBtn" size="small" type="danger">排序</el-button>
      <div class="tip">
        <p>导入必须包含该4个字段：职位代码——准考证号——笔试或体能测试总分——排名</p>
      </div>
    </div>
    <el-table v-loading="tableConfig.loading" :data="tableConfig.list" stripe height="calc(100vh - 100px)" size="small">
      <el-table-column v-for="(item,index) in tableConfig.header" :key="index" :prop="item" :label="item"></el-table-column>
    </el-table>
    <div class="totalClass">共{{tableConfig.list.length}}条</div>
  </div>
</template>

<script setup>
import ImportFile from '@/components/import.vue'
import {reactive, ref} from "vue";
import {ElMessage} from "element-plus";
const tableConfig = reactive({
  header:[],
  list:[],
  tableName:'',
  loading: false
})
const objList = ref({})
const success = ({header, result, fileName}) => {
  tableConfig.loading = true
  tableConfig.name = fileName
  tableConfig.header = header
  tableConfig.list = result
  let obj = {}
  tableConfig.list.forEach(el => {
    if(obj[el['职位代码']]){
      obj[el['职位代码']].push(el)
    }else{
      obj[el['职位代码']] = []
      obj[el['职位代码']].push(el)
    }
  })
  objList.value = obj
  tableConfig.loading = false
}
const exportData = () => {
  let headers = {}
  tableConfig.header.forEach(el => {
    headers[el] = el
  })
  import('@/vendor/Export2Excel').then(async excel => {
    const data = formatJson(headers, tableConfig.list)
    excel.export_json_to_excel({
      header: Object.keys(headers),
      data,
      fileName: tableConfig.tableName
    })
    ElMessage.success('导出成功!')
  })
}
// 将表头数据和数据进行对应
const formatJson = (headers, rows) => {
  return rows.map(item => {
    return Object.keys(headers).map(key => {
      return item[headers[key]]
    })
  })
}
const groupBtn = () => {
  let allList = JSON.parse(JSON.stringify(Object.values(objList.value)))
  allList.forEach(el => {
    // el.forEach((item) => {
    //   if(typeof item['笔试或体能测试总分'] === 'string'){
    //     item['笔试或体能测试总分'] = 0
    //   }
    // })
    let filterList = el.filter((item) => {
      if(typeof item['笔试或体能测试总分'] === 'string'){
        item['排名'] = item['笔试或体能测试总分']
      }else{
        return el
      }
    })
    let newList = filterList.sort((a,b)=>{
      return b['笔试或体能测试总分'] - a['笔试或体能测试总分']
    })
    let prescore = 0;//预定义分数
    let ranking = 0;//排名
    let same = 0; //是否相同
    newList.forEach((item,index) => {
      if(item['笔试或体能测试总分'] === prescore){
        item['排名'] = ranking
        same++
      }else{
        ranking = ranking + same
        ranking++
        prescore = item['笔试或体能测试总分']
        same = 0
        item['排名'] = ranking
      }
    })
  })
  allList.forEach(el => {
    el.forEach(item => {
      tableConfig.list.forEach(t => {
        if(t['准考证号'] === item['准考证号']){
          t['排名'] = item['排名']
        }
      })
    })
  })
}
</script>

<style scoped lang='scss'>
.Achievement{
  .header{
    display: flex;
    align-items: center;
    height: 64px;
  }
  .totalClass{
    font-size: 12px;
    margin-top: 10px;
  }
  .tip{
    font-size: 12px;
    margin-left: 20px;
    color: #da9519;
  }
}
</style>
